<template>
  <!-- 过敏信息单项 -->
  <td>
    <el-select :value="value" clearable :allow-create="isAdd" filterable remote :remote-method="getData" @change="onChange" @clear="onClear" :placeholder="placeholder">
      <el-option v-for="(item,index) in dataList" :key="index" :label="item.allergyName" :value="item.allergyName"></el-option>
    </el-select>
  </td>
</template>
<script>
export default {
  props: ["value", "type"],
  data() {
    return {
      dataList: [],
      isAdd: false,
      placeholder: "请选择"
    };
  },
  mounted() {
    let th = this;
    switch (th.type) {
      case "1":
        th.placeholder = "过敏源";
        break;
      case "2":
        th.placeholder = "过敏症状";
        break;
      case "3":
        th.placeholder = "过敏程度";
        break;
    }
    th.isAdd = th.$parent.isAdd;
    if (!th.value) th.getData();
  },
  methods: {
    onClear() {
      const th = this;
      th.$emit("input", "");
      th.getData();
    },
    getData(name) {
      let th = this;
      let j = {
        pageNum: 1,
        pageSize: 20,
        type: th.type,
        allergyKey: name
      };
      th.$api.pageQueryMedicalStock(j).then(res => {
        if (res.executed) {
          th.dataList = res.dataBody.list;
        }
      });
    },
    onChange(value) {
      let th = this;
      if (!value) return;
      th.$emit("input", value);
      if (!th.isAdd) return;
      //判断是否应该添加
      let data = th.dataList.find(d => {
        return d.allergyName == value;
      });
      if (data) return;
      let j = {
        type: th.type,
        allergyName: value
      };
      th.$api.addAllergyEnum(j).then(res => {
        if (res.executed) {
        }
      });
    }
  }
};
</script>
